{% extends 'base.html' %}

{% block title %}{{ article.title }} - {{ site_info.site_name }}{% endblock %}

{% block content %}
<div class="row">
    <div class="col-md-8">
        <div class="card mb-4">
            <div class="card-header bg-primary text-white">
                <h2 class="mb-0">{{ article.title }}</h2>
            </div>
            
            <div class="card-body">
                <div class="mb-3">
                    <p class="text-muted">
                        <i class="fas fa-user me-1"></i> {{ article.author.username }}
                        <i class="fas fa-calendar-alt ms-3 me-1"></i> {{ article.created_at|date:"Y年m月d日" }}
                        {% if article.updated_at != article.created_at %}
                            <i class="fas fa-edit ms-3 me-1"></i> 更新于 {{ article.updated_at|date:"Y年m月d日" }}
                        {% endif %}
                        <span class="ms-3">
                            <i class="fas fa-eye"></i> 阅读量: {{ article.visit_count|default:"0" }}
                        </span>
                    </p>
                </div>
                
                <div class="article-content">
                    {{ article.content|safe }}
                </div>
                
                <div class="mt-4 text-end">
                    <a href="{% url 'articles:list' %}" class="btn btn-outline-secondary">
                        <i class="fas fa-arrow-left me-1"></i> 返回文章列表
                    </a>
                </div>
            </div>
        </div>
    </div>
    
    <div class="col-md-4">
        <!-- 作者信息 -->
        <div class="card mb-4">
            <div class="card-header bg-secondary text-white">
                <h5 class="mb-0">作者信息</h5>
            </div>
            <div class="card-body">
                <h6>{{ article.author.username }}</h6>
                {% if article.author.profile.bio %}
                    <p>{{ article.author.profile.bio|truncatechars:100 }}</p>
                {% else %}
                    <p class="text-muted">该用户还没有添加个人简介</p>
                {% endif %}
                
                {% if article.author.profile.website %}
                    <a href="{{ article.author.profile.website }}" target="_blank" class="btn btn-sm btn-outline-primary">
                        <i class="fas fa-globe me-1"></i> 个人网站
                    </a>
                {% endif %}
            </div>
        </div>
        
        <!-- 相关文章 -->
        {% if related_articles %}
            <div class="card">
                <div class="card-header bg-secondary text-white">
                    <h5 class="mb-0">相关文章</h5>
                </div>
                <div class="card-body">
                    <ul class="list-group list-group-flush">
                        {% for related_article in related_articles %}
                            <li class="list-group-item">
                                <a href="{% url 'articles:detail' related_article.id %}">{{ related_article.title }}</a>
                                <p class="text-muted mb-0">
                                    <small>{{ related_article.created_at|date:"Y年m月d日" }}</small>
                                </p>
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>
        {% endif %}
    </div>
</div>
{% endblock %} 